<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    <!--<script src="http://static.runoob.com/assets/vue/1.0.11/vue.min.js"></script>-->
    <script src="js/vue.js"></script>
</head>
<body>
    <div id="demo">
        <p>
            <input type="text" v-model="msg">
            {{msg}}
        </p>
        <!-- checkbox -->

        <p>
            <input
                    type="checkbox"
                    v-model="toggle"
                    :true-value="a"
                    :false-value="b">
            {{toggle}}</p>
        <p>
            <input type="checkbox" v-model="checked">
            {{checked}}
        </p>
        <!-- radio buttons -->
        <p>
            <input type="radio" name="picked" value="one" v-model="picked">
            <input type="radio" name="picked" value="two" v-model="picked">
            {{picked}}
        </p>
        <!-- select -->
        <p>
            <select v-model="selected">
                <option>one</option>
                <option>two</option>
            </select>
            {{selected}}
        </p>
        <!-- multiple select -->
        <p>
            <select v-model="multiSelect" multiple>
                <option>one</option>
                <option>two</option>
                <option>three</option>
            </select>
            {{multiSelect}}
        </p>
       <!-- <p><pre>data: {{$data | json}}</pre></p>-->
         <span v-el:other-msg>world</span>
    </div>








<script>

  var vm =new Vue({
        el: '#demo',
        data: {
            toggle:'a',
            a:'a',
            b:'b',
            msg: 'h11111111111i!',
            checked  : true,
            picked   : 'one',
            selected : 'two',
            multiSelect: ['one', 'three']
        },
        methods:{
            init:function () {
           var a=this.$el.msg.; // -> "hello"
//                var b=this.$els.otherMsg.textContent // -> "world"
//                var c=this.$els.msg //-><span>hello</span>
                console.log("a------------------->"+a);
            }
        }

    })
    vm.init();
</script>
</body>
</html>
